<template>
  <div id="app">

    <router-view/>

    <!--S全局底部导航-->
    <tab ref="tab" v-show="main.includes($route.name)" :navs-index="tab_index"></tab>
    <!--E全局底部导航-->

    <!--S全局素材库-->
    <media v-if="medias('show')" :value="medias('value')" :select="medias('select')" :type="medias('type')" @close="mediaClose" @select="mediaSelect"></media>
    <!--E全局素材库-->

    <!--S全局海报显示器-->
    <poster v-show="posters('show')" :assist-value="posters('assist_value')" :value="posters('value')" @close="postersClose">{{posters('assist_text')}}</poster>
    <!--E全局海报显示器-->

    <!--S全局打开外部页面-->
    <page :toggle="pages('show')" :src="pages('src')" @close="pagesClose"></page>
    <!--E全局打开外部页面-->
  </div>
</template>

<script>
  import Tool from "./util/Tool.js";
  import tab from "./components/tabbar/Tabbar";
  import media from "./components/media/Media";
  import poster from "./components/poster/Poster";
  import page from "./module/page/Page";
  export default {
    data(){
      return {
        main:['home','index','me'],   //主页面
        tab_index:0
      }
    },
    components:{
      tab,
      media,
      poster,
      page
    },
    computed:{
      medias(){
        return this.$store.getters.medias;
      },
      mediaClose(){
        return this.$store.state.media.onClose;
      },
      mediaSelect(){
        return this.$store.state.media.onSelect;
      },
      posters(){
        return this.$store.getters.posters;
      },
      postersClose(){
        return this.$store.state.poster.onClose;
      },
      pages(){
        return this.$store.getters.pages;
      },
      pagesClose(){
        return this.$store.state.page.onClose;
      }
    },
    mounted() {
      Tool.login()
      this.getNotice()
      this.parseShareId()
    },
    methods:{
      /**
       * 获取公告内容
       */
      getNotice(){
        this.$url("notice/getNotice")
        .then((res)=>{
          if(res.data.status === "success"){
            this.$createDialog({
              type: 'confirm',
              title: '公告',
              content: res.data.data,
              confirmBtn:{
                text:"确认已读"
              },
              onConfirm:()=>{
                //已读操作
                this.$url("notice/read");
              }
            }).show()
          }
        });
      },
      /**
       * 分享解析，返回分享者uid和红包red_id
       */
      parseShareId(){
        if(this.$sysinfo.share_id !== ''){
          Tool.parseShareId()
        }
      }
    }
  }
</script>

<style lang="less">
    .children{
      position: fixed;
      background: #F6F6F6;
      z-index:11;
      top:0;
      width: 375px;
    }
</style>
<style lang="stylus">
body,html
  height 100%
#app
  font-family 'Avenir', Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  -moz-osx-font-smoothing grayscale
  font-size 16px
  color #2f2f2f;
  background #F6F6F6
  height 100%
.cube-toast-tip
  max-width 300px
</style>
